<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition 
    template="/template/templatePadrao.xhtml"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
    xmlns:p="http://primefaces.org/ui"
    xmlns:f="http://xmlns.jcp.org/jsf/core">
    <ui:define name="conteudoCentro"> 
        <h:body>
            <h:form id="formListLocal">
                <p:messages id="mLocal" showDetail="true"/>
                <p:panel header="Lista de locais" style="text-align: center">
                    <center>
                        <p:dataTable
                            id="imListagemLocal"
                            emptyMessage="Nenhum registro"
                            value="#{localBean.listaLocais}"
                            var="local">
                            <f:facet name="header">
                                <h:outputText value="Locais de Extração de Açaí"/>
                            </f:facet>
                            <p:column headerText="Local">
                                <h:outputText value="#{local.nome}" />
                            </p:column>
                            <p:column headerText="Complemento">
                                <h:outputText value="#{local.complemento}" />
                            </p:column>
                            <p:column headerText="Latitude">
                                <h:outputText value="#{local.latitude}" />
                            </p:column>
                            <p:column headerText="Longitude">
                                <h:outputText value="#{local.longitude}" />
                            </p:column>
                            <p:column headerText="Operações">
                                <p:commandButton
                                    id="imEditar"
                                    ajax="false"
                                    icon="ui-icon-pencil"
                                    title="Editar"
                                    action="#{localBean.editar()}">
                                    <f:setPropertyActionListener
                                        target="#{localBean.local}"
                                        value="#{local}"/>
                                </p:commandButton>
                                <p:commandButton
                                    id="imExcluir"
                                    ajax="false"
                                    icon="ui-icon-trash"
                                    title="Excluir"
                                    update="imListagemLocal"
                                    action="#{localBean.excluir()}">
                                    <f:setPropertyActionListener
                                        target="#{localBean.local}"
                                        value="#{local}"/>
                                </p:commandButton>
                            </p:column>
                        </p:dataTable>
                        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
                        <br/>
                        <br/>
                        <p:gmap id="gmap" center="-1.431362,-48.492637" zoom="10" type="HYBRID" model="#{localBean.pontosLocais}" style="width:80%;height:400px">
                            <p:ajax event="markerDrag" listener="#{localBean.onMarkerDrag}" update="mLocal" />
                        </p:gmap>
                    </center>
                </p:panel>
            </h:form>
        </h:body>
    </ui:define>
</ui:composition>